<template>
  <div class="meitituiguang_fabu">
    <top></top>
    <div class="flex zhiboxitong_content">
      <div class="left">
        <left></left>
      </div>
      <div class="right">
        <div class="zhiboxitong_right">
          <el-breadcrumb separator="/" v-if="!$route.query.tab">
            <el-breadcrumb-item :to="{ path: '/zhiboxitong/zhiboxiaoshou'}">直播销售</el-breadcrumb-item>
            <el-breadcrumb-item>媒体推广商品管理</el-breadcrumb-item>
            <el-breadcrumb-item>添加商品</el-breadcrumb-item>
          </el-breadcrumb>
            <div class="quote_images">
                <img src="../../static/img/alt.png" class="alt_image" @click="yinyong" />
                <!-- <div @click="yinyong" style="background:#335DFF;width: 174.78px;height: 36px; text-align: center; line-height: 36px; border: 1px solid rgb(68, 132, 255);border-radius:5px; color: white; cursor: pointer;">快速引用其他商品配置</div> -->
                <!-- <el-tooltip class="item" style="margin-left: 10px;" effect="dark" content="使用其他商品已编辑好的下单信息填写设置和下单限制设置及评论板块" placement="top-start">
                	<i class="el-icon-question" style="color: rgb(196, 196, 196); font-size: 25px; margin-left: 5px; cursor: pointer;" ></i>
                </el-tooltip>-->
              </div>
          <div
            style="color: rgb(51, 51, 51); font-size: 16px; margin:30px 20px 20px 20px;font-weight:bold"
          >商品信息配置</div>
          <div
            style="background:#F8F9FD; padding: 0 30px;margin-top: 20px; padding-bottom: 30px;border-top-left-radius: 20px;border-bottom-left-radius: 20px;"
          >
            <div class="fleft" style="width: 100%;">

              <div class="flexc" style="margin-bottom: 20px;">
                <div class="z">
                  <span class="red">*</span>选择商品:
                </div>
                <div class="r flex">
                  <el-input
                    v-model="all.page_name"
                    style="width: 220px; margin-right: 20px;"
                    placeholder="请选择商品"
                    disabled
                    v-if="all.page_name != ''"
                  ></el-input>
                  <el-button
                    @click="xuanzeshangpinkai(1)"
                    style="background:#F72C6A;border-radius:12px;border:none;color:white"
                  >选择商品</el-button>
                </div>
              </div>
              <div
                v-if="chooseitem.take_number>0"
                class="flexc"
                style="margin-bottom: 20px;margin-left: 35px;"
              >
                <div class="z">该商品支持选号:</div>
                <div class="r">
                  <el-radio v-model="is_pick_num" :label="1">开启选号</el-radio>
                  <el-radio v-model="is_pick_num" :label="0">不开启</el-radio>
                </div>
              </div>
              <div v-if="chooseitem.take_number>0" class="flexc" style="margin-bottom: 20px;">
                <div class="z"></div>
                <div class="r" style="display: flex;align-items: center;">
                  显示靓号吉祥话术：
                  <el-switch
                    v-model="all2.jixiang"
                    active-value="1"
                    inactive-value="2"
                    active-color="#13ce66"
                    inactive-color="#ff4949"
                  ></el-switch>
                  <el-tooltip style="margin-left: 10px;" effect="dark" placement="right">
                    <div slot="content">
                      <img style="width: 150px;" src="../../static/img/jx.png" alt />
                    </div>
                    <i
                      class="el-icon-question"
                      style="color: rgb(196, 196, 196); font-size: 25px; margin-left: 5px; cursor: pointer;"
                    ></i>
                  </el-tooltip>
                </div>
              </div>

              <div class="flexc" style="margin-bottom: 20px;">
                <div class="z"></div>
                <div class="r" style="display: flex;align-items: center;">
                  广点通推广模板：
                  <el-switch
                    v-model="all.is_gdt_template"
                    :active-value="1"
                    :inactive-value="0"
                    active-color="#13ce66"
                    inactive-color="#ff4949"
                  ></el-switch>
                </div>
              </div>

              <div class="flexc" style="margin-bottom: 20px;">
                <div class="z">
                  <span class="red">*</span>商品名称:
                </div>
                <div class="r">
                  <el-input v-model="all.sale_name" style="width: 220px;" placeholder="输入商品标题"></el-input>
                </div>
              </div>
              <div class="flexc" style="margin-bottom: 20px;" v-if="!$route.query.tab">
                <div class="z">
                  <span class="red">*</span>订单来源:
                </div>
                <div class="r">
                  <el-input v-model="all.page_source" style="width: 220px;" placeholder="请输入订单来源"></el-input>
                </div>
                <el-tooltip
                  class="item"
                  effect="dark"
                  content="在订单来源中显示，用于区分下单来源，例如：某某推广渠道"
                  placement="top-start"
                >
                  <i
                    class="el-icon-question"
                    style="color: rgb(196, 196, 196); font-size: 25px; margin-left: 5px; cursor: pointer;"
                  ></i>
                </el-tooltip>
                <!-- <div style="color: rgb(181, 181, 181); font-size: 12px; margin-left: 20px; color: rgb(30, 108, 255);">在订单来源中显示，用于区分下单来源，例如：某某推广渠道</div> -->
              </div>

              <div class="flexc" style="margin-bottom: 20px;" v-if="$route.query.tab">
                <div class="z">商品分类:</div>
                <div class="r">
                  <el-select
                    v-model="all.cat_ids"
                    style="width: 220px;"
                    multiple
                    collapse-tags
                    placeholder="请选择商品分类"
                  >
                    <el-option
                      v-for="item in shangpinfenlei"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    ></el-option>
                  </el-select>
                </div>
                <div
                  @click="go('/zhiboxitong/fenleiguanli')"
                  style="margin-left: 20px; color: #409EFF; cursor: pointer;"
                >分类管理</div>
              </div>

              <div class="flexc" style="margin-bottom: 20px;" v-if="$route.query.tab">
                <div class="z">
                  <span class="red">*</span>商品排序:
                </div>
                <div class="r">
                  <el-input style="width: 220px;" v-model="all.order" placeholder="请输入商品排序"></el-input>
                </div>
              </div>

              <div class="flexc" style="margin-bottom: 20px;" v-if="$route.query.tab">
                <div class="z">
                  <span class="red">*</span>商品主图:
                </div>
                <div class="r">
                  <chuantu
                    ref="chuantu"
                    v-if="relo"
                    @getimg="getimg"
                    :imgs="all.pic"
                    widths="100px"
                    heights="100px"
                    style="background:white"
                  ></chuantu>
                </div>
              </div>
              <div class="flexc" style="margin-bottom: 20px;" v-if="$route.query.tab">
                <div class="z">
                  分享海报图
                  （分享引用）:
                </div>
                <div class="r">
                  <chuantu
                    ref="chuantu"
                    v-if="relo"
                    @getimg="getimg3"
                    :imgs="all.market_pic"
                    widths="100px"
                    heights="100px"
                    style="background:white"
                  ></chuantu>
                </div>
              </div>

              <div class="flexc youse" style="margin-bottom: 20px;" v-if="$route.query.tab">
                <div class="z">下单按钮名称：</div>
                <div class="r">
                  <el-input
                    v-model="all.order_button"
                    :maxlength="20"
                    style="width: 220px;"
                    placeholder="请输入下单按钮名称"
                  ></el-input>
                </div>
                <el-tooltip
                  class="item"
                  effect="dark"
                  content="例如免费领取、立刻抢购、提交订单等，不超过20个字"
                  placement="top-start"
                >
                  <i
                    class="el-icon-question"
                    style="color: rgb(196, 196, 196); font-size: 25px; margin-left: 5px; cursor: pointer;"
                  ></i>
                </el-tooltip>
              </div>
              <div class="flexc youse" style="margin-bottom: 20px;" v-if="$route.query.tab">
                <div class="z">提醒注意点：</div>
                <div class="r">
                  <el-input v-model="all.tips" style="width: 220px;" placeholder="请输入提醒注意点"></el-input>
                </div>
                <el-tooltip
                  class="item"
                  effect="dark"
                  content="例如年龄限制，地域限制等提醒信息，不设置不会显示"
                  placement="top-start"
                >
                  <i
                    class="el-icon-question"
                    style="color: rgb(196, 196, 196); font-size: 25px; margin-left: 5px; cursor: pointer;"
                  ></i>
                </el-tooltip>
              </div>
              <div class="flexc youse" style="margin-bottom: 20px;" v-if="$route.query.tab">
                <div class="z">卖点：</div>
                <div class="r">
                  <el-input
                    v-model="all.sell_point2[0]"
                    :maxlength="15"
                    style="width: 110px; margin-right: 20px;"
                    placeholder="请输入卖点"
                  ></el-input>
                </div>
                <div class="r">
                  <el-input
                    v-model="all.sell_point2[1]"
                    :maxlength="15"
                    style="width: 110px; margin-right: 20px;"
                    placeholder="请输入卖点"
                  ></el-input>
                </div>
                <div class="r">
                  <el-input
                    v-model="all.sell_point2[2]"
                    :maxlength="15"
                    style="width: 110px; margin-right: 20px;"
                    placeholder="请输入卖点"
                  ></el-input>
                </div>
                <div class="r">
                  <el-input
                    v-model="all.sell_point2[3]"
                    :maxlength="15"
                    style="width: 110px; margin-right: 20px;"
                    placeholder="请输入卖点"
                  ></el-input>
                </div>
                <el-tooltip
                  class="item"
                  effect="dark"
                  content="最多支持4个卖点展示，单个卖点建议4个字，最大不超过15个字"
                  placement="top-start"
                >
                  <i
                    class="el-icon-question"
                    style="color: rgb(196, 196, 196); font-size: 25px; margin-left: 5px; cursor: pointer;"
                  ></i>
                </el-tooltip>
              </div>
              <div class="flexc youse" style="margin-bottom: 20px;">
                <div class="z">
                  <span class="red">*</span>售价:
                </div>
                <div class="r">
                  <el-input v-model="all.price" style="width: 220px;" placeholder="请输入售价"></el-input>
                </div>
                <el-tooltip class="item" effect="dark" content="不填或填写0表示无需支付" placement="top-start">
                  <i
                    class="el-icon-question"
                    style="color: rgb(196, 196, 196); font-size: 25px; margin-left: 5px; cursor: pointer;"
                  ></i>
                </el-tooltip>

                <div class="z" v-if="$route.query.tab">原价：</div>
                <div class="r" v-if="$route.query.tab">
                  <el-input v-model="all.origin_price" style="width: 220px;" placeholder="请输入售价"></el-input>
                </div>
                <el-tooltip
                  v-if="$route.query.tab"
                  class="item"
                  effect="dark"
                  content="原价为画横线价格，仅渲染氛围"
                  placement="top-start"
                >
                  <i
                    class="el-icon-question"
                    style="color: rgb(196, 196, 196); font-size: 25px; margin-left: 5px; cursor: pointer;"
                  ></i>
                </el-tooltip>
              </div>
              <div class="flexc youse" style="margin-bottom: 20px;" v-if="$route.query.tab">
                <div class="z">展示已有销量：</div>
                <div class="r">
                  <el-input
                    v-model="all.saled_amount"
                    style="width: 220px;"
                    placeholder="请输入展示已有销量"
                  ></el-input>
                </div>
                <el-tooltip
                  class="item"
                  effect="dark"
                  content="商品陈列处展示，不设置不会显示"
                  placement="top-start"
                >
                  <i
                    class="el-icon-question"
                    style="color: rgb(196, 196, 196); font-size: 25px; margin-left: 5px; cursor: pointer;"
                  ></i>
                </el-tooltip>
              </div>

              <!-- <div class="flexc" style="margin-bottom: 20px;">
                  <div class="z"><span class="red">*</span>商品价格:</div>
                  <div class="r"><el-input style="width: 220px;" v-model="all.price" placeholder="请输入商品价格"></el-input></div>
              </div>-->
              <!-- <div class="flexc" style="margin-bottom: 20px;">
                  <div class="z"><span class="red">*</span>商品排序:</div>
                  <div class="r"><el-input style="width: 220px;" v-model="all.order" placeholder="请输入商品排序"></el-input></div>
                </div>
                <div class="flexc" style="margin-bottom: 20px;">
                  <div class="z">月租:</div>
                  <div class="r"><el-input style="width: 220px;" v-model="all.yuezu" placeholder="请输入月租"></el-input></div>
                </div>
                <div class="flexc" style="margin-bottom: 20px;">
                  <div class="z">流量:</div>
                  <div class="r"><el-input style="width: 220px;" v-model="all.liuliang" placeholder="请输入流量"></el-input></div>
                </div>

                <div class="flexc" style="margin-bottom: 20px;">
                  <div class="z">语音:</div>
                  <div class="r"><el-input style="width: 220px;" v-model="all.yuyin" placeholder="请输入语音"></el-input></div>
                </div>
                <div class="flexc" style="margin-bottom: 20px;">
                  <div class="z">套餐优惠:</div>
                  <div class="r"><el-input style="width: 220px;" v-model="all.taocan" placeholder="请输入套餐优惠"></el-input></div>
              </div>-->
            </div>
          </div>
          <div
            style="color: rgb(51, 51, 51); font-size: 16px; margin: 20px 20px;font-weight:bold; display: flex;align-items: center;"
          >
            赠品（子商品）配置
            <span style="margin-left:28px ;color: #999999;font-size: 14px;">本功能会在用户下单处增加赠品选项的勾选框，用户勾选表示同意获取赠品，敢探号在后台会同时创建一个赠品商品的订单，赠品订单右上角会有"赠"字，点击展示其原订单ID</span>
          </div>
          <div
            style="background:#F8F9FD; padding: 0 30px;margin-top: 20px; padding-bottom: 30px;border-top-left-radius: 20px;border-bottom-left-radius: 20px;"
          >
            <div class="fleft" style="position: relative; width: 100%;">

              <div class="flexc" style="margin-bottom: 20px;">
                <div class="z">
                  添加赠品子商品:
                </div>
                <div class="r flex">
                  <el-input
                    v-model="all2.page_name_zi"
                    style="width: 220px; margin-right: 20px;"
                    placeholder="请选择商品"
                    disabled
                    v-if="all2.page_name_zi != ''"
                  ></el-input>
                  <el-button
                    @click="xuanzeshangpinkai(2)"
                    style="background:#F72C6A;border-radius:12px;border:none;color:white"
                  >选择商品</el-button>
                </div>
              </div>


              <div class="flexc" style="margin-bottom: 20px;align-items: center;">
                <div class="z">
                  赠品宣传图:
                </div>
                <div class="r">
                  <chuantu
                    ref="chuantu"
                    v-if="relo"
                    @getimg="getimg6"
                    :imgs="all2.pic_zi"
                    widths="100px"
                    heights="100px"
                    style="background:white"
                  ></chuantu>
                </div>
                <div style="margin-left: 13px;">用于引导用户勾选的图片</div>
              </div>

              <div class="flexc" style="margin-bottom: 20px;">
                <div class="z" style="margin-top:20px">赠品默认勾选:</div>
                <div class="r">
                  <el-switch
                  @change="change1"
                    style="display: block;margin-top:20px"
                    v-model="all2.zimoren"
                    active-color="rgb(71, 140, 253)"
                    inactive-color="rgb(69, 69, 69)"
                    active-value="1"
                    inactive-value="2"
                  ></el-switch>
                </div>
              </div>


             </div>
          </div>
          <div
            style="color: rgb(51, 51, 51); font-size: 16px; margin: 20px 20px;font-weight:bold;"
          >商品下单页配置</div>
          <div
            style="background:#F8F9FD;  margin-top: 20px;border-top-left-radius: 20px;border-bottom-left-radius: 20px;"
          >
            <div class="flexc" style="margin-bottom: 20px;">
              <div class="z" style="width: 170px;margin-bottom: 20px;">下单页头图:</div>
              <div class="r">
                <chuantu
                  ref="chuantu"
                  v-if="relo"
                  @getimg="getimg2"
                  :imgs="all.details"
                  widths="100px"
                  heights="100px"
                  style="margin-top: 20px;background:white"
                ></chuantu>
              </div>
            </div>

            <div class="flexc" style="margin-bottom: 20px;">
              <div class="z" style="width: 170px;">选择主题:</div>
              <div class="r">
                <div
                  style="background: #F72C6A;border-radius:10px; color: white; width: 90px; line-height: 32px; text-align: center; cursor: pointer;"
                  @click="yanseshow"
                >{{all2.yansename}}</div>
              </div>
            </div>

            <div class="flexc" style="margin-bottom: 20px;">
              <!-- <div class="z" style="width: 170px;">内容填写背景色：</div>
              <div class="r" style="margin-right: 20px;"><el-color-picker v-model="all2.neirongcolor" show-alpha></el-color-picker></div>

              <div class="z" style="width: 170px;">提单按钮颜色：</div>
              <div class="r" style="margin-right: 20px;"><el-color-picker v-model="all2.anniucolor" show-alpha></el-color-picker></div>
              -->
              <div class="z" style="width: 170px;">提单按钮文字：</div>
              <div class="r">
                <el-input v-model="all2.anniuwenzi" style="width: 220px;" placeholder="请输入提单按钮文字"></el-input>
              </div>
            </div>

            <div class="flexc" style="margin-bottom: 20px;" v-if="!$route.query.app_id">
              <div class="z" style="width: 170px;">入网协议展示:</div>
              <div class="r">
                <el-switch
                  style="display: block"
                  v-model="all.network_access_protocol"
                  @change="shifouxianshixieyi2"
                  active-color="rgb(71, 140, 253)"
                  inactive-color="rgb(69, 69, 69)"
                  active-value="1"
                  inactive-value="0"
                ></el-switch>
              </div>
            </div>

            <div class="flexc" style="margin-bottom: 20px;" v-if="all.network_access_protocol == 1">
              <div class="z" style="width: 170px;">选择协议:</div>
              <div class="r flexc">
                <el-select
                  class="youse"
                  v-model="all.protocol_id"
                  @change="shifouxianshixieyi"
                  clearable
                  filterable
                  multiple
                  collapse-tags
                  placeholder="请选择要展示的协议"
                  v-if="all.network_access_protocol == 1"
                >
                  <el-option
                    v-for="item in xieyilist"
                    :key="item.id"
                    :label="item.title"
                    :value="item.id"
                  ></el-option>
                </el-select>

                <div class="b_nav" style="margin-left: 20px;">
                  <el-button type="text" style="color:#335DFF" @click="goAccord">管理协议</el-button>
                </div>

                <!-- <el-checkbox style="margin-left: 20px;" v-model="all.protocol_check"></el-checkbox>

                <el-tooltip class="item" effect="dark" content="使用默认勾选后用户下单时无需勾选,此操作不合规,请谨慎使用" placement="top-start">
                	<i class="el-icon-question" style="color: rgb(196, 196, 196); font-size: 25px; margin-left: 5px; cursor: pointer;" ></i>
                </el-tooltip>-->
              </div>
            </div>
            <div class="flexc" style="margin-bottom: 20px;" v-if="all.network_access_protocol == 1">
              <div class="z" style="width: 170px;">协议设置:</div>
              <div class="r flexc">
                <el-select
                  class="youse"
                  v-model="all.protocol_check"
                  @change="choosexyset"
                  placeholder="请选择要展示的协议"
                  v-if="all.network_access_protocol == 1"
                >
                  <el-option :value="2" label="用户需勾选同意协议才能下单"></el-option>
                  <el-option :value="1" label="默认替用户勾选同意协议"></el-option>
                  <el-option :value="3" label="用户不勾选同意协议也可下单"></el-option>
                </el-select>
                <el-checkbox style="margin-left: 20px;" v-model="all2.protocol_qz"></el-checkbox>
                <div style="margin-left: 5px;">用户勾选同意时强制展示协议内容</div>
              </div>
            </div>

            <div class="flexc" style="margin-bottom: 20px;">
              <div class="z" style="width: 170px;">下单页详情:</div>
              <div class="r">
                <fuwenben
                  :description="all.description"
                  @fuwenbenfanhui="fuwenbenfanhui"
                  v-if="fuwenbenshow"
                ></fuwenben>
              </div>
            </div>

            <div class="flexc" style="margin-bottom: 20px;">
              <div class="z" style="width: 170px;">可点击图片:</div>
              <div class="r">
                <chuantu
                  ref="chuantu"
                  v-if="relo"
                  @getimg="getimg4"
                  :imgs="all.detail_pic_one"
                  widths="100px"
                  heights="100px"
                  style="background:white"
                ></chuantu>
              </div>

              <div class="z" style="width: 170px;">点击展示图:</div>
              <div class="r">
                <chuantu
                  ref="chuantu"
                  v-if="relo"
                  @getimg="getimg5"
                  :imgs="all.detail_pic_two"
                  widths="100px"
                  heights="100px"
                  style="background:white"
                ></chuantu>
              </div>
            </div>

            <div class="flexc" style="margin-bottom: 20px;">
              <div class="z" style="width: 170px;">底部详情:</div>
              <div class="r" style="margin-bottom: 20px;">
                <fuwenben2
                  :description="all.footer_description"
                  @fuwenbenfanhui="fuwenbenfanhui2"
                  v-if="fuwenbenshow"
                ></fuwenben2>
              </div>
            </div>


            <div class="flexc" style="margin-bottom: 20px;">
              <div class="z" style="margin-top:20px;width: 170px;margin-left: 15px;">下单二次确认:</div>
              <div class="r" style="display: flex;align-items: center;">
                <el-switch
                  style="display: block;margin-top:20px"
                  v-model="all2.sureagain"
                  active-color="rgb(71, 140, 253)"
                  inactive-color="rgb(69, 69, 69)"
                  active-value="1"
                  inactive-value="2"
                ></el-switch>
                <span style="margin-top: 22px;margin-left: 10px;">用户在点击提交订单时会弹出您设置的确认内容让用户再次确认，用户点击确认后下单成功</span>
              </div>
            </div>
            <div class="flexc" style="padding-bottom: 20px;align-items: center;">
              <div class="z" style="width: 184px;">
                上传需确认的内容:
              </div>
              <div class="r">
                <chuantu
                  ref="chuantu"
                  v-if="relo"
                  @getimg="getimg8"
                  :imgs="all2.pic_sure"
                  widths="100px"
                  heights="100px"
                  style="background:white"
                ></chuantu>
              </div>
              <!-- <div style="margin-left: 13px;">限制宽度为660PX</div> -->
            </div>
          </div>
          <div
            style="color: rgb(51, 51, 51); font-size: 16px; margin: 20px 20px;font-weight:bold;"
          >商品下单信息填写配置</div>
          <div
            style="background:#F8F9FD; padding: 10px 40px;margin-top: 20px;border-top-left-radius: 20px;border-bottom-left-radius: 20px;"
          >
            <div class="flexc" style="margin-bottom: 20px;">
              <div class="z" style="width: 170px;margin-top:20px">身份证信息填写:</div>
              <div class="r">
                <el-switch
                  style="display: block;margin-top:20px"
                  v-model="all2.needidcard"
                  @change="isneedcard"
                  active-color="rgb(71, 140, 253)"
                  inactive-color="rgb(69, 69, 69)"
                  active-value="1"
                  inactive-value="2"
                ></el-switch>
              </div>
            </div>
            <div class="flexc" style="margin-bottom: 20px;">
              <div class="z" style="width: 170px;margin-left:40px">收货人使用身份证姓名:</div>
              <div class="r">
                <el-switch
                  style="display: block"
                  v-model="all2.shouhuorenxingming"
                  active-color="rgb(71, 140, 253)"
                  inactive-color="rgb(69, 69, 69)"
                  :active-value="true"
                  :inactive-value="false"
                ></el-switch>
              </div>
              <el-tooltip
                class="item"
                effect="dark"
                content="强制收件人为办理人本人，用户不在需要填写收货人"
                placement="top-start"
              >
                <i
                  class="el-icon-question"
                  style="color: rgb(196, 196, 196); font-size: 25px; margin-left: 5px; cursor: pointer;"
                ></i>
              </el-tooltip>
            </div>
            <div class="flexc" style="margin-bottom: 20px;">
              <div class="z" style="width: 170px;">身份证照片上传:</div>
              <div class="r">
                <el-switch
                  style="display: block"
                  v-model="all2.shenfenzheng"
                  active-color="rgb(71, 140, 253)"
                  inactive-color="rgb(69, 69, 69)"
                  :active-value="true"
                  :inactive-value="false"
                ></el-switch>
              </div>
              <div
                style="color: rgb(126, 126, 126); font-size: 12px; margin-left: 10px;"
                v-if="all2.shenfenzheng"
              >提示：检测到当前选择的商品需要照片</div>

              <el-checkbox v-if="all2.shenfenzheng" style="margin-right: 10px; margin-left: 20px;" v-model="all.is_not_need_glasses" :true-label="1" :false-label="0"></el-checkbox>
              <div  v-if="all2.shenfenzheng" style="margin-right: 10px;">要求免冠照不戴眼镜</div>

              <el-checkbox style="margin-right: 10px; margin-left: 20px;" v-model="all2.shangchuanneirongma"></el-checkbox>
              <div style="margin-right: 10px;">添加自定义上传图片</div>
              <el-input v-if="all2.shangchuanneirongma" v-model="all2.shangchuanneirong" style="width: 220px;" placeholder="上传内容描述"></el-input>

              <div style="margin:0 20px;"  v-if="all2.shangchuanneirongma">示例图:</div>

              <chuantu
                ref="chuantu"
                v-if="relo && all2.shangchuanneirongma"
                @getimg="getimg9"
                :imgs="all2.custom_photo_illustration"
                widths="100px"
                heights="100px"
                style="background:white"
              ></chuantu>


            </div>

            <div class="flexc" style="margin-bottom: 50px;">
              <div class="z" style="width: 170px;margin-left:40px">提单信息填写展示方式:</div>
              <div class="r flexc">
                <div style="margin-right: 10px;">
                  <el-radio v-model="all2.xiantianxie" label="2">逐渐显示填写信息</el-radio>
                </div>
                <el-tooltip
                  class="item"
                  effect="dark"
                  content="先显示姓名电话，填写完成后再显示其他填写项"
                  placement="top-start"
                >
                  <i
                    class="el-icon-question"
                    style="color: rgb(196, 196, 196); font-size: 25px; margin-left: 5px; cursor: pointer;"
                  ></i>
                </el-tooltip>
                <div style="margin-left: 30px;">
                  <el-radio v-model="all2.xiantianxie" label="1">直接列出全部填写信息</el-radio>
                </div>
                <el-tooltip
                  class="item"
                  effect="dark"
                  content="直接给用户列出所有要填写的下单信息"
                  placement="top-start"
                >
                  <i
                    class="el-icon-question"
                    style="color: rgb(196, 196, 196); font-size: 25px; margin-left: 5px; cursor: pointer;"
                  ></i>
                </el-tooltip>
              </div>
            </div>

            <div class="flexc" style="margin-bottom: 50px;">
              <div class="z" style="width: 170px;margin-left:40px">境外短信电话拦截选项:</div>
              <div class="r flexc">
                <el-checkbox-group v-model="all2.lanjie">
                    <el-checkbox label="1">开通非内地电话拦截（不接收非内地电话）</el-checkbox>
                    <el-checkbox label="2">开通非内地短信拦截（不接收非内地短信）</el-checkbox>
                </el-checkbox-group>
              </div>
            </div>

            <div class="flexc" style="margin-bottom: 50px;">
              <div class="z" style="width: 170px;">自定义填写信息：</div>
              <div class="r">
                <div v-for="(item,index) in all.custom_info" :key="index" class="flexc" style="margin-bottom: 10px;">
                  <el-input v-model="item.name" style="width: 220px;" maxlength="15" placeholder="字段名称"></el-input>
                  <el-select
                    v-model="item.geshi"
                    style="margin-left: 20px;"
                    placeholder="格式："
                  >
                    <el-option label="文本格式" :value="0"></el-option>
                    <el-option label="数字格式" :value="1"></el-option>
                  </el-select>
                  <el-checkbox style="margin-left: 20px;" v-model="item.bitian">必填</el-checkbox>
                  <div @click="shanchuitem(index)" style="cursor: pointer; color: #409EFF; margin-left: 20px;">删除</div>
                </div>
                <div @click="tianjiaitem()" style="cursor: pointer; color: #409EFF;" v-if="all.custom_info.length != 3">添加</div>
              </div>
            </div>

            <div class="flexc" style="margin-bottom: 50px;">
              <div class="z" style="width: 170px;">自定义提示信息：</div>
              <div class="r flexc">
                <el-input v-model="all.custom_remind" :disabled="bukebianji" style="width: 600px;" placeholder="填写真实身份信息，未满18岁、一证五号、信息错误将无法发货"></el-input>
                <div @click="bukebianji = false" style="cursor: pointer; color: #409EFF; margin-left: 20px;">编辑</div>
              </div>
            </div>

          </div>
          <div
            style="color: rgb(51, 51, 51); font-size: 16px; margin: 20px 20px;font-weight:bold"
          >用户下单限制设置</div>
          <div
            style="background:#F8F9FD; padding: 20px 30px; margin-top: 20px; padding-bottom: 30px;border-top-left-radius: 20px;border-bottom-left-radius: 20px;"
          >
            <div class="flexc" style="margin-bottom: 20px;">
              <div class="z" style="width: 170px;">下单年龄限制：</div>
              <div class="r">
                <el-switch
                  style="display: block"
                  v-model="all2.needage"
                  active-color="rgb(71, 140, 253)"
                  inactive-color="rgb(69, 69, 69)"
                ></el-switch>
              </div>
            </div>
            <div class="flexc" style="margin-bottom: 20px;" v-if="all2.needage">
              <div class="z" style="width: 170px;">允许下单的年龄范围：</div>
              <div class="r">
                <div class="flexc">
                  <el-input
                    v-model="all2.min_page"
                    style="width: 120px; margin-right: 10px;"
                    placeholder="选择最小年龄"
                  ></el-input>——
                  <el-input
                    v-model="all2.max_page"
                    style="width: 120px; margin:0 10px;"
                    placeholder="选择最大年龄"
                  ></el-input>
                </div>
              </div>
            </div>
            <div class="flexc" style="margin-bottom: 20px;">
              <div class="z" style="width: 170px;">下单数量限制：</div>
              <div class="r">
                <el-switch
                  style="display: block"
                  v-model="all2.xiadanshuliang"
                  @change="xuanzeshuliang2"
                  active-color="rgb(71, 140, 253)"
                  inactive-color="rgb(69, 69, 69)"
                ></el-switch>
              </div>
            </div>
            <div class="flexc" style="margin-bottom: 20px;" v-if="all2.xiadanshuliang">
              <div class="z" style="width: 170px;">选择限制数量：</div>
              <div class="r">
                <el-select v-model="all.limit" @change="xuanzeshuliang" placeholder="选择限制数量">
                  <!-- <el-option label="不限制" :value="0"></el-option> -->
                  <el-option v-for="item in 9" :key="item" :label="item" :value="item"></el-option>
                </el-select>
              </div>
              <div
                class="z"
                style="width: 170px;"
                v-if="all2.needidcard=='1'||all2.needidcard=='2'"
              >识别方式选择：</div>
              <div class="r">
                <el-select
                  v-model="limit_type1"
                  style="margin-left: 20px;"
                  placeholder="识别方式选择："
                  v-if="all2.needidcard=='1'"
                >
                  <el-option label="按照身份证识别" :value="0"></el-option>
                  <el-option label="按照手机号识别" :value="1"></el-option>
                  <el-option label="按照IP地址识别" :value="2"></el-option>
                </el-select>
                <el-select
                  v-model="limit_type2"
                  style="margin-left: 20px;"
                  placeholder="识别方式选择："
                  v-if="all2.needidcard=='2'"
                >
                  <el-option label="按照手机号识别" :value="1"></el-option>
                  <el-option label="按照IP地址识别" :value="2"></el-option>
                </el-select>
                <span
                  v-if="limit_type2 == 2 || limit_type1 == 2"
                  style="color: #999; margin-left: 10px;"
                >如果投放页面的环境无法获取用户IP，此限制将会失效。</span>
              </div>
            </div>
            <div class="flex" style="margin-bottom: 20px;">
              <div class="z" style="width: 170px;">不发货地区设置：</div>
              <div class="r">
                <div class="flexc" style="padding-bottom: 20px;">
                  <div style="margin-right: 20px;">
                    <el-radio v-model="all2.bufahuodiqu" label="2">使用产品的不发货区域</el-radio>
                  </div>
                  <div style="margin-right: 20px;">
                    <el-radio v-model="all2.bufahuodiqu" label="1">设置只发货区域</el-radio>
                  </div>
                  <div>
                    <el-radio v-model="all2.bufahuodiqu" label="3">设置不发货区域</el-radio>
                  </div>
                </div>
                <div style="background:white; padding-bottom: 20px;" v-if="all2.bufahuodiqu == 1">
                  <div style="color: #999; font-size: 12px; padding: 10px 23px;">设置后用户只能选择选中的省市为收货地址</div>
                  <div style="padding-left: 23px;">
                    <el-cascader
                      :options="options"
                      v-model="all2.delivery_city"
                      style="width: 400ox;"
                      collapse-tags
                      :props="props"
                      clearable
                    ></el-cascader>
                  </div>
                </div>
                <div style="background:white; padding-bottom: 20px;" v-if="all2.bufahuodiqu == 3">
                  <div style="color: #999; font-size: 12px; padding: 10px 23px;">设置后用户不能选择选中的省市为收货地址</div>
                  <div style="padding-left: 23px;">
                    <el-cascader
                      ref="test"
                      :options="options"
                      v-model="all2.no_city"
                      style="width: 400ox;"
                      collapse-tags
                      :props="props"
                      clearable
                      @change="test"
                    ></el-cascader>
                  </div>
                </div>
                <div
                  style=" background: white; padding:0 20px;"
                  v-if=" all2.bufahuodiqu == 3"
                >
                  <div class="flexc">
                    <div style="line-height: 32px;">批量上传地址</div>
                    <div style="margin-left: 20px;">
                      <el-upload
                        :show-file-list="false"
                        action="https://jsonplaceholder.typicode.com/posts/"
                        :http-request="upup"
                      >
                        <el-button size="small" type="text">上传不发货地址</el-button>
                      </el-upload>
                    </div>
                  </div>
                  <el-button type="text" @click="down">模板下载</el-button>
                </div>
              </div>
            </div>
            <div class="flexc" style="margin-bottom: 10px;margin-left:40px">
              <div>身份证信息国政通效险（付费0.2元/条）：</div>
              <div class="r">
                <el-switch
                  style="display: block"
                  v-model="all2.guozhengtong"
                  active-color="rgb(71, 140, 253)"
                  inactive-color="rgb(69, 69, 69)"
                ></el-switch>
              </div>
            </div>

            <div
              style="margin-bottom: 20px; color: rgb(127, 127, 127); font-size: 12px;margin-left:40px"
            >用户填写的身份证信息需经过国政通效险后才可通过，敢探号余额不足后将不会再验证身份证信息，用户可正常下单</div>
            <div class="flexc" style="margin-bottom: 10px;margin-left:40px">
              <div>联系电话验证码校验（付费5分/条）：</div>
              <div class="r flexc">
                <el-switch
                  style="display: block"
                  v-model="all2.duanxin"
                  active-color="rgb(71, 140, 253)"
                  inactive-color="rgb(69, 69, 69)"
                ></el-switch>

                <div class="flexc" style="margin-left: 50px;">
                  <div>请选择签名：</div>
                  <div class="r">
                    <el-select v-model="all.sign" style="margin-left: 20px;" placeholder="识别方式选择：">
                      <el-option
                        :label="item.name"
                        :value="item.id"
                        v-for="item in signlist"
                        :key="item.id"
                      ></el-option>
                    </el-select>
                  </div>
                </div>
              </div>
            </div>
            <div
              style="margin-bottom: 50px; color: rgb(127, 127, 127); font-size: 12px;margin-left:40px"
            >提醒：验证码有小概率会出现部分用户收不到的情况</div>
          </div>
          <div
            style="color: rgb(51, 51, 51); font-size: 16px; margin: 20px 20px;font-weight:bold"
          >销售氛围</div>
          <div
            style="margin-top:20px;background:#F8F9FD; padding: 0 30px;padding-bottom: 30px;border-top-left-radius: 20px;border-bottom-left-radius: 20px;overflow: hidden;"
          >
            <div class="flexc" style="margin-top:20px">
              <div
                style="color: rgb(51, 51, 51); font-size: 16px;font-weight:bold;margin-left: 40px; "
              >评论板块</div>
              <el-tooltip
                style="margin-left: 10px;"
                class="item"
                effect="dark"
                content="直接给用户列出所有要填写的下单信息"
                placement="top-start"
              >
                <i
                  class="el-icon-question"
                  style="color: rgb(196, 196, 196); font-size: 25px; margin-left: 5px; cursor: pointer;"
                ></i>
              </el-tooltip>
              <el-switch
                style="display: block;margin-left: 10px;"
                v-model="all2.pinglun"
                active-color="rgb(71, 140, 253)"
                inactive-color="rgb(69, 69, 69)"
                active-value="1"
                inactive-value="0"
              ></el-switch>
            </div>
            <div class="flexc" v-if="all2.pinglun == 1">
              <div style="margin-top:20px">
                <span style="margin:0  40px 0 40px">评论板块:</span>
                <el-select v-model="all2.pinglunid" placeholder="请选择评论模板">
                  <el-option
                    v-for="item in pinglunlist"
                    :key="item.id"
                    :label="item.title"
                    :value="item.id"
                  ></el-option>
                </el-select>
              </div>
              <div
                @click="goRemark"
                style="margin-left: 20px; cursor: pointer; color: rgb(50, 85, 255);margin-top: 20px;"
              >管理评论模板</div>
            </div>
            <div class="flexc" style="height: 30px; ">
              <div
                style="color: rgb(51, 51, 51);font-size: 16px;font-weight:bold;margin-left: 40px;margin-top: 20px; "
              >领取播报模块</div>
              <el-tooltip
                style="margin-left: 10px;margin-top: 20px;"
                class="item"
                effect="dark"
                content="滚动展示XXX几分钟前已领取,用来制造销售氛围"
                placement="top-start"
              >
                <i
                  class="el-icon-question"
                  style="color: rgb(196, 196, 196); font-size: 25px; margin-left: 5px; cursor: pointer;"
                ></i>
              </el-tooltip>
              <el-switch
                style="display: block;margin-left: 10px;margin-top: 20px; "
                v-model="all2.gm"
                active-color="rgb(71, 140, 253)"
                inactive-color="rgb(69, 69, 69)"
                active-value="1"
                inactive-value="0"
              ></el-switch>
            </div>
          </div>
          <!-- 页面悬浮按钮 -->
          <div
            style="color: rgb(51, 51, 51); font-size: 16px; margin: 20px 20px;font-weight:bold"
          >页面悬浮按钮</div>
          <div
            style="margin-top:20px;background:#F8F9FD; padding: 0 30px;padding-bottom: 30px;border-top-left-radius: 20px;border-bottom-left-radius: 20px;overflow: hidden;"
          >
            <div style="display:flex;margin-top:25px;margin-left:40px;font-size:14px">
              订单查询显示
              <el-switch
                style="display: block;margin-left: 15px;"
                v-model="all2.ddcx"
                active-color="rgb(71, 140, 253)"
                inactive-color="rgb(69, 69, 69)"
                active-value="1"
                inactive-value="0"
              ></el-switch>
            </div>
            <div style="display:flex;margin-top:20px;margin-left:40px;font-size:14px">
              在线客服显示
              <el-switch
                style="display: block;margin-left: 15px;"
                v-model="all2.zxkf"
                active-color="rgb(71, 140, 253)"
                inactive-color="rgb(69, 69, 69)"
                active-value="1"
                inactive-value="0"
              ></el-switch>
              <span style="margin-left:40px;margin-top:-8px">
                  跳转链接：<el-input placeholder="请输入跳转链接" style="width:220px" v-model="all2.jumpUrl"></el-input>
              </span>
            </div>

          </div>
          <!-- 页面悬浮按钮 -->
          <div
            style="color: rgb(51, 51, 51); font-size: 16px; margin: 20px 20px;font-weight:bold"
            v-if="shopid == 127837 || shopid == 50481  || shopid == 612992 || shopid == 591129 || shopid == 301655 || shopid == 621588 || shopid == 626586 || shopid == 309830 || shopid == 641901"
          >信息回调设置</div>
          <div
            style="margin-top:20px;background:#F8F9FD; padding: 0 30px;padding-bottom: 30px;border-top-left-radius: 20px;border-bottom-left-radius: 20px;overflow: hidden;"
            v-if="shopid == 127837 || shopid == 50481  || shopid == 612992 || shopid == 591129 || shopid == 301655 || shopid == 621588 || shopid == 626586 || shopid == 309830 || shopid == 641901"
          >
            <div
              v-if="shopid == 127837 || shopid == 50481  || shopid == 612992 || shopid == 591129 || shopid == 301655 || shopid == 621588 || shopid == 626586 || shopid == 309830 || shopid == 641901"
              style="margin-top:20px"
            >
              <!-- <div class="flexc" style="height: 80px; margin-top: 50px;"> -->
              <!-- <el-switch  style="display: block;margin-left: 10px;"   v-model="all2.pinglun"  active-color="rgb(71, 140, 253)"  inactive-color="rgb(69, 69, 69)"  active-value="1" inactive-value="0" ></el-switch> -->
              <!-- </div> -->
              <div class="flex" style="margin-bottom: 20px;">
                <div class="z" style="width: 170px; padding-top: 10px;">回调类型：</div>
                <div class="r">
                  <el-select
                    v-model="all.huidiaoleixing"
                    @change="shengchenglianjie"
                    placeholder="请选择回调类型"
                  >
                    <el-option label="抖音巨量" value="1"></el-option>
                    <el-option label="快手" value="2"></el-option>
                    <el-option label="最右" value="3"></el-option>
                    <el-option label="soul" value="4"></el-option>

                    <el-option label="微博" value="5"></el-option>
                    <el-option label="B站" value="6"></el-option>
                    <el-option label="优酷" value="7"></el-option>

                    <el-option label="百度" value="8"></el-option>
                    <el-option label="广点通" value="9"></el-option>
                    <el-option label="支付宝" value="10"></el-option>

                    <el-option label="自有渠道" value="13"></el-option>
                  </el-select>
                  <div
                    class="flexc"
                    style="border-radius: 64px; margin-top: 20px; background:white; padding: 0px 5px 0px 20px;"
                  >
                    <div
                      style="width: 200px; overflow: hidden; height: 32px; line-height: 32px;"
                    >{{url}}</div>
                    <el-button
                      type="danger"
                      round
                      size="small"
                      style="margin-left: 20px;"
                      @click="copy(url)"
                    >复制链接</el-button>
                  </div>
                </div>
              </div>

              <div class="flexc" style="margin-bottom: 20px;margin-left:12px" v-if="all.huidiaoleixing != 13">
                <div class="z" style="width: 170px;">触发回调状态：</div>
                <div class="r" style="margin-left:20px">
                  <el-select v-model="all.order_status" placeholder="触发回调状态">
                    <el-option label="无" :value="0"></el-option>
                    <el-option label="开卡中/已领取" :value="1"></el-option>
                    <el-option label="待发货/已发货" :value="2"></el-option>
                    <el-option label="下单后回调" :value="3"></el-option>
                    <el-option label="填写完手机号回调" :value="4"></el-option>
                  </el-select>
                </div>
              </div>

              <div class="flexc" style="margin-bottom: 20px;" v-if="all.huidiaoleixing != 13">
                <div class="z" style="width: 170px;">请选择回调比例：</div>
                <div class="r">
                  <el-select v-model="all.callback_percent" placeholder="请选择回调比例">
                    <el-option label="10%" value="10"></el-option>
                    <el-option label="20%" value="20"></el-option>
                    <el-option label="30%" value="30"></el-option>
                    <el-option label="40%" value="40"></el-option>
                    <el-option label="50%" value="50"></el-option>
                    <el-option label="60%" value="60"></el-option>
                    <el-option label="70%" value="70"></el-option>
                    <el-option label="80%" value="80"></el-option>
                    <el-option label="90%" value="90"></el-option>
                    <el-option label="100%" value="100"></el-option>
                  </el-select>
                </div>
              </div>
<!--
              <div class="flexc" style="margin-bottom: 20px;">
                <div class="z" style="width: 170px;">请选择回调触发：</div>
                <div class="r flexc">
                  <div style="margin-right: 20px;">
                    <el-radio v-model="all.callback_time" :label="1">下单后回调</el-radio>
                  </div>
                  <div style="margin-right: 20px;">
                    <el-radio v-model="all.callback_time" :label="2">填写完手机号回调</el-radio>
                  </div>
                </div>
              </div> -->

              <div class="flexc" style=" padding-bottom: 20px;" v-if="all.huidiaoleixing != 13">
                <div class="z" style="width: 170px;">回调触发城市：</div>
                <div class="r flexc">
                  <el-cascader
                    :options="options"
                    v-model="all.callback_condition"
                    collapse-tags
                    :props="props"
                    clearable
                  ></el-cascader>
                </div>
              </div>

              <div class="flexc" style=" padding-bottom: 20px;" v-if="all.huidiaoleixing != 13">

                <div class="z" style="width: 170px;">回调触发年龄：</div>
                <div class="r flexc">
                  <el-input v-model="all.age_min" style="width: 220px; margin-right: 10px; " placeholder="推广回传年龄区间最小值"></el-input>
                  ——
                  <el-input v-model="all.age_max" style="width: 220px; margin:0 10px;" placeholder="推广回传年龄区间最大值"></el-input>
                </div>
              </div>

            </div>
          </div>
          <div
            style="color: rgb(51, 51, 51); font-size: 16px; margin: 20px 20px;font-weight:bold"
            v-if="shopid == 127837 || shopid == 50481 || shopid == 612992 || shopid == 301655 || shopid == 626586 || shopid == 621588 || shopid == 309830 || shopid == 641901"
          >信息流优化策略</div>

          <div
            style="background:#F8F9FD; padding: 0 30px; margin-top: 20px; padding-bottom: 30px;border-radius: 20px;"
            v-if="shopid == 127837 || shopid == 50481 || shopid == 612992 || shopid == 301655 || shopid == 626586 || shopid == 621588 || shopid == 309830 || shopid == 641901"
          >
            <div class="xialeft">
              <!--              <h3>商品下单信息填写配置</h3>
              <h4 style="margin: 20px 0;">入网协议</h4>
              <div class="flexc">
                <div style="margin-right: 20px;"><el-radio v-model="all.network_access_protocol" :label="0">无</el-radio></div>
                <div style="margin-right: 20px;"><el-radio v-model="all.network_access_protocol" :label="1">有</el-radio></div>

                <el-select v-model="all.protocol_id" clearable filterable multiple collapse-tags style="margin-left: 20px;" placeholder="选择协议" v-if="all.network_access_protocol == 1">
                  <el-option v-for="item in xieyilist" :key="item.id" :label="item.title" :value="item.id"></el-option>
                </el-select>

                <router-link class="b_nav" style="margin-left: 20px;" to="/zhiboxitong/ruwangxieyi">
                  <el-button type="primary">管理协议</el-button>
                </router-link>


                <el-checkbox style="margin-left: 20px;" v-model="all.protocol_check">默认勾选</el-checkbox>

                <el-tooltip class="item" effect="dark" content="使用默认勾选后用户下单时无需勾选,此操作不合规,请谨慎使用" placement="top-start">
                	<i class="el-icon-question" style="color: rgb(196, 196, 196); font-size: 25px; margin-left: 5px; cursor: pointer;" ></i>
                </el-tooltip>
              </div>-->

              <!-- <h4 style="margin: 20px 0;">模式选择</h4>
              <div class="flexc">
                <div style="margin-right: 20px;"><el-radio v-model="all2.xiantianxie" label="2">逐渐显示填写信息</el-radio></div>
                <el-tooltip class="item" effect="dark" content="先显示姓名电话，填写完成后再显示其他填写项" placement="top-start">
                	<i class="el-icon-question" style="color: rgb(196, 196, 196); font-size: 25px; margin-left: 5px; cursor: pointer;" ></i>
                </el-tooltip>
                <div style="margin-right: 20px;"><el-radio v-model="all2.xiantianxie" label="1">直接列出全部填写信息</el-radio></div>
                <el-tooltip class="item" effect="dark" content="直接给用户列出所有要填写的下单信息" placement="top-start">
                	<i class="el-icon-question" style="color: rgb(196, 196, 196); font-size: 25px; margin-left: 5px; cursor: pointer;" ></i>
                </el-tooltip>
              </div>-->
              <!-- <div style="height: 1px; width: 100%; background: rgb(208, 208, 208);"></div> -->

              <!-- <div style="height: 1px; width: 100%; background: rgb(208, 208, 208);"></div> -->

              <div v-if="shopid == 127837 || shopid == 50481 || shopid == 612992 || shopid == 301655 || shopid == 626586 || shopid == 621588 || shopid == 309830 || shopid == 641901">
                <div class="flexc" style="height: 40px;">
                  <!-- <el-switch  style="display: block;margin-left: 10px;"   v-model="all2.pinglun"  active-color="rgb(71, 140, 253)"  inactive-color="rgb(69, 69, 69)"  active-value="1" inactive-value="0" ></el-switch> -->
                </div>
                <div style="padding-left: 30px; color: rgb(51, 51, 51);">
                  <div class="flexc" style="margin-bottom: 20px;">
                    <div>开启直接提单：</div>
                    <div>
                      <el-switch
                        style="display: block;margin-left: 10px;"
                        v-model="all.direct_order"
                        active-color="rgb(71, 140, 253)"
                        inactive-color="rgb(69, 69, 69)"
                        :active-value="1"
                        :inactive-value="0"
                      ></el-switch>
                    </div>
                    <div
                      style="font-size: 12px; color: rgb(153, 153, 153); margin-left: 20px;"
                    >注：开通该功能后订单会直接提单至运营商生产接口，并根据返回的失败原因决定跳转新套餐或者重新选号下单</div>
                  </div>
                  <div class="flexc" style="margin-bottom: 20px;">当接口返回提单结果时，根据结果关键词匹配触发相应动作</div>

                  <div
                    class="flexc"
                    style="margin-bottom: 10px;"
                    v-for="(itemk,index) in all.keyword_notice"
                    :key="index"
                  >
                    <div>返回原因关键词：</div>
                    <div>
                      <el-input v-model="itemk.keyword" style="width: 220px;" placeholder="请输入关键词"></el-input>
                    </div>
                    <div style="margin-left: 20px;">触发提醒：</div>
                    <div>
                      <el-input v-model="itemk.notice" style="width: 220px;" placeholder="请输入提醒内容"></el-input>
                    </div>
                    <div
                      style="color: rgb(42, 86, 255); margin-left: 20px;"
                      @click="shanchukeyword_notice(index)"
                    >删除</div>
                  </div>

                  <div
                    style="color: rgb(42, 86, 255); margin-bottom: 20px; font-size: 12px;"
                    @click="addkeyword_notice"
                  >+添加关键词</div>

                  <div class="flexc" style="margin-bottom: 20px;">
                    <div>以上关键词都没有触发时则弹窗推荐其他商品:：</div>
                    <div style="margin-left: 20px;">
                      <el-switch
                        style="display: block;margin-left: 10px;"
                        v-model="all.has_recommend"
                        active-color="rgb(71, 140, 253)"
                        inactive-color="rgb(69, 69, 69)"
                        :active-value="1"
                        :inactive-value="0"
                      ></el-switch>
                    </div>
                  </div>
                  <div class="flexc" style="margin-bottom: 20px;">
                    <div>上传弹窗广告图:</div>
                    <div style="margin-left: 20px;">
                      <chuantu
                        ref="chuantu"
                        v-if="relo"
                        @getimg="getimgk"
                        :imgs="all.pop_banner"
                        widths="100px"
                        heights="100px"
                        style="background:white"
                      ></chuantu>
                    </div>
                  </div>
                  <div class="flexc" style="margin-bottom: 20px;">
                    <div>选择推荐的商品：</div>
                    <div>
                      <el-select
                        v-model="all.recommend_product"
                        clearable
                        filterable
                        placeholder="选择跳转的推荐商品"
                      >
                        <el-option
                          v-for="item in pagelist"
                          :key="item.id"
                          :label="item.sale_name"
                          :value="item.id"
                        ></el-option>
                      </el-select>

                      <!-- <el-button type="danger" size="medium">选择跳转的推荐商品</el-button> -->
                    </div>
                    <div></div>
                  </div>
                </div>
              </div>
            </div>

            <!-- <div class="xiaright" v-if="all2.xiantianxie == 1">
              <div style="height: 620px; overflow: auto;">
                <div style="text-align: center; font-size: 14px;">{{all.sale_name}}</div>
                <div><img src="https://static.91haoka.cn/gantanhao%2Fxingming.png"></div>
                <div v-if="all2.duanxin && all2.shenfenzheng"><img src="https://static.91haoka.cn/gantanhao%2Fyouyanzhengmayouzhengjian.png"></div>
                <div v-if="all2.duanxin && !all2.shenfenzheng"><img src="https://static.91haoka.cn/gantanhao%2Fyouyanzhengma.png"></div>
                <div v-if="!all2.duanxin && all2.shenfenzheng"><img src="https://static.91haoka.cn/gantanhao%2Fwuyanzhengmayouzhengjian.png"></div>
                <div v-if="!all2.duanxin && !all2.shenfenzheng"><img src="https://static.91haoka.cn/gantanhao%2Fwuyanzhengma.png"></div>
                <div>
                    <div style="text-align: center; color: #999; font-size: 12px;" v-if="all2.gongsidianhua">{{all2.gongsidianhua}}</div>
                </div>
              </div>

            </div>
            <div class="xiaright" v-if="all2.xiantianxie == 2">
              <div style="height: 620px; overflow: auto;">
                <div style="text-align: center; font-size: 14px;">{{all.sale_name}}</div>
                <div v-if="all2.duanxin"><img src="https://static.91haoka.cn/gantanhao/xiantian2yanzhengma.png"></div>
                <div v-if="!all2.duanxin"><img src="https://static.91haoka.cn/gantanhao/xiantian2.png"></div>
                <div>
                   <div style="text-align: center; color: #999; font-size: 12px;" v-if="all2.gongsidianhua">{{all2.gongsidianhua}}</div>
                </div>
              </div>
            </div>-->
          </div>

          <div style="height: 100px;" class="flexcc">
            <el-button
              type="danger"
              round
              @click="fabu()"
              v-if="!all.tab"
              style="width:200px;height:50px;background:#3158F1;border:none"
            >下一步</el-button>
            <el-button
              type="danger"
              round
              @click="fabu()"
              v-if="all.tab"
              style="width:200px;height:50px;background:#3158F1;border:none"
            >发布</el-button>
          </div>
        </div>
      </div>
    </div>

    <el-dialog title="根据已有直播页发布页面" :visible.sync="log" :close-on-click-modal="false" width="700px">
      <div class="flex">
        <el-select v-model="tongbuall" placeholder="选择已有的直播页">
          <el-option v-for="item in list" :key="item.value" :label="item.name" :value="item.value"></el-option>
        </el-select>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="log = false" style="border:none;border-radius: 10px;">取消</el-button>
        <el-button
          type="primary"
          @click="tongbugo"
          style="background:#3158F1;border:none;color:white;border-radius: 10px;"
        >确认</el-button>
      </span>
    </el-dialog>

    <el-dialog title="选择商品" :visible.sync="log_shop" width="700px">
      <div>
        <div class="flex">
          <el-input
            v-model="shopsearch.title"
            style="width: 180px; margin-right:20px;"
            placeholder="请输入商品名称"
          ></el-input>
          <el-input
            v-model="shopsearch.fetch_code"
            style="width: 180px; margin-right:20px;"
            placeholder="请输入商品编码"
          ></el-input>
          <el-button @click="getshops()" round style="background:#3158F1;color:white;width:100px">搜索</el-button>
        </div>
        <div style="height: 600px; overflow: auto;">
          <div
            class="flexbc"
            v-for="item in shoplists"
            :key="item.id"
            style=" padding:10px 20px; margin-top:10px;"
          >
            <div class="flexc">
              <div style="margin-right: 20px;">
                <img
                  :src="item.image1 || 'https://91haoka.cn/gth/static/img/kenan.jpg'"
                  style="width: 100px; height:100px;border-radius: 10px;"
                />
              </div>
              <div style="margin-right: 20px;">
                <div style="margin-bottom: 10px; font-weight: bold;">
                  {{item.title}}
                  <!-- <el-button type="warning" style="margin-left: 20px;" size="mini" v-if="item.take_number == 1 && item.mobile_config == 1">归属地选号</el-button> -->
                  <el-button
                    type="warning"
                    style="margin-left: 20px;"
                    size="mini"
                    v-if="item.take_number>0"
                  >支持选号</el-button>
                </div>
                <div style="margin-bottom: 10px;">编码：{{item.fetch_code}}</div>
                <div style="margin-bottom: 10px;">创建时间：{{item.created_at}}</div>
              </div>
            </div>

            <div>
              <el-button
                type="danger"
                v-if="!fuzhixinxi"
                @click="xuanzhong(item)"
                round
                style="background:#F72C6A"
              >选择商品</el-button>
              <el-button type="danger" v-if="fuzhixinxi" @click="xuanzhong2(item)">选择商品复制</el-button>
            </div>
          </div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="log_shop = false" style="border-radius:12px">取消</el-button>
      </span>
    </el-dialog>
    <fuzhishangpinxinxi
      @fuzhishangpinxinxi2="fuzhishangpinxinxi2"
      v-if="fuzhishangpinxinxilog"
      ref="fuzhishangpinxinxi"
    ></fuzhishangpinxinxi>
    <yansexuanze @yansexuanze="yansexuanze" :yansename="all2.yansename" :yuanjiaoa="all2.yuanjiao" ref="yansexuanze" v-if="yansexuanzelog"></yansexuanze>
  </div>
</template>

<script>
import { tongyidizhi } from "../common/tongyidiqu.js";
import * as qiniu from "qiniu-js";
import axios from "axios";
import top from "./components/top.vue";
import left from "./components/left.vue";
import chuantu from "../components/chuantu.vue";
import { bufahuodiqu } from "../assets/bufahuodiqu.js";
import fuwenben from "../components/fuwenben.vue";
import fuwenben2 from "../components/fuwenben2.vue";
import yansexuanze from "./meitituiguanglog/yansexuanze.vue";
import fuzhishangpinxinxi from "./meitituiguanglog/fuzhishangpinxinxi.vue";
export default {
  components: {
    top,
    left,
    chuantu,
    fuwenben,
    yansexuanze,
    fuzhishangpinxinxi,
    fuwenben2
  },
  name: "meitituiguang_fabu",
  data() {
    return {
      bukebianji:true,
      shangpinfenlei: [],
      fuzhishangpinxinxilog: false,
      fuzhixinxi: false,
      list: "",
      tongbuall: "",
      log: false,
      log_shop: false,
      input: "",
      all: {
        custom_info:[],
        custom_remind:"填写真实身份信息，未满18岁、一证五号、信息错误将无法发货",
        footer_description: "",
        detail_pic_one: "",
        detail_pic_two: "",
        tab: this.$route.query.tab || 0,
        page_id: "", //	613552	是	string	敢探号商品id
        json: "", //		是	string	无
        sale_name: "", //	wq29元1	是	string	销售商品名
        on_sale: 0, //		是	string	在售
        price: "", //	11	是	string	价格
        pic: "", //		是	string	图片
        details: "", //		是	string	详情
        order: 0, //		是	string	无
        delivery_area: "", //		是	string	无
        delivery_city: "", //		是	string	无
        id: this.$route.query.id ? this.$route.query.id : "", //	1	否	string	修改用
        page_name: "",
        page_source: "",
        limit: 0,
        limit_type: "",
        description: "",
        network_access_protocol: 0,
        protocol_id: [],
        protocol_check: 2,
        order_button: "立刻办理",
        tips: "",
        sell_point: ["", "", "", ""],
        sell_point2: ["", "", "", ""],
        origin_price: 0,
        saled_amount: "",
        cat_ids: [],
        sign: "",
        keyword_notice: [],
        direct_order: 0,
        has_recommend: 0,
        pop_banner: "",
        recommend_product: "",
        age_min:"",
        age_max:""
      },
      xieyilist: "",
      yansexuanzelog:false,
      all2: {
        yuanjiao:1,
        lanjie:[],
        xiadanshuliang: false,
        needage: false,
        guozhengtong: false,
        zuidaxiadan: false,
        duanxin: false,
        shouhuorenxingming: true,
        shenfenzheng: false,
        bufahuodiqu: "2",
        delivery_city: "",
        no_city: "",
        bufahuosheng: [],
        xiantianxie: "1",
        needidcard: "1",
        ruwangxieyi: "0",
        gongsiming: "",
        gongsidizhi: "",
        gongsidianhua: "",
        dingdanzhuangtai: "0",
        kuaishou: "",
        pinglun: "0",
        pinglunid: "",
        neirongcolor: "rgb(157, 111, 255)",
        anniucolor: "rgb(255, 64, 33)",
        anniuwenzi: "0元领取  包邮到家",
        yansename: "紫色",
        yueduyanse: "rgb(66, 6, 93)",
        min_page: "",
        max_page: "",
        protocol_qz: false,
        gm: "",
        jixiang: "1",
        ddcx: false,
        zxkf: false,
        jumpUrl:"",
        page_name_zi:'',
        page_id_zi:'',
        zimoren:'1',
        pic_zi:'',
        sureagain:'2',
        pic_sure:''
      },
      shoplists: "",
      shopsearch: {
        title: "",
        fetch_code: ""
      },

      radio: "1",
      options: [],
      props: {
        multiple: true
      },
      relo: true,
      limit_type1: 0,
      limit_type2: 1,
      chanpinxixi: "",
      xiaozi: false,
      log_shop2: false,
      chooseitem: {
        take_number: ""
      },
      is_pick_num: 1,
      url: "",
      shopid: "",
      signlist: [],
      pagelist: [],
      timer: "",
      iszi:1,
    };
  },
  created() {
    console.log(this.all2.needidcard);
    console.log(this.all2);

    this.getshangpinfenlei();
    this.getsign();
    console.log(this.all2.needidcard);
    this.shopid = localStorage.getItem("sc_shopid");

    axios.get(`${this.apis}/api/all/page/list`).then(response => {
      if (response.data.msg.code == 0) {
        this.pagelist = response.data.data;
      } else {
        this.$message.error(response.data.msg.info);
      }
    });
    // this.shopid = localStorage.getItem('sc_shopid')
    axios.get(`${this.apis}/api/account/shop/info`).then(response => {
      if (response.data.msg.code == 0) {
        this.shopid = response.data.data.shop_id;
      } else {
        this.$message.error(response.data.msg.info);
      }
    });
  },
  mounted() {
    this.options = bufahuodiqu;
    // this.options = tongyidizhi

    this.getshops();
    if (this.$route.query.id) {
      let p = new Promise((res, rej) => {
        axios
          .get(`${this.apis}/api/page/info/manage?id=${this.$route.query.id}`)
          .then(response => {
            if (response.data.msg.code == 0) {
              this.is_pick_num = response.data.data.is_pick_num;

              // if(response.data.data.take_number>0){
              //   this.chooseitem.take_number =response.data.data.take_number
              //   this.is_pick_num = response.data.data.is_pick_num
              // }
              if (
                response.data.data.sell_point != null &&
                response.data.data.sell_point
              ) {
                let arr = ["", "", "", ""];
                if (JSON.parse(response.data.data.sell_point)[0]) {
                  arr[0] = JSON.parse(response.data.data.sell_point)[0];
                }
                if (JSON.parse(response.data.data.sell_point)[1]) {
                  arr[1] = JSON.parse(response.data.data.sell_point)[1];
                }
                if (JSON.parse(response.data.data.sell_point)[2]) {
                  arr[2] = JSON.parse(response.data.data.sell_point)[2];
                }
                if (JSON.parse(response.data.data.sell_point)[3]) {
                  arr[3] = JSON.parse(response.data.data.sell_point)[3];
                }
                response.data.data.sell_point2 = arr;
              } else {
                response.data.data.sell_point2 = ["", "", "", ""];
              }

              if(!response.data.data.custom_info){
                response.data.data.custom_info = []
              }else{
                response.data.data.custom_info = JSON.parse(response.data.data.custom_info)
              }


              if(!response.data.data.custom_remind || response.data.data.custom_remind == '' || response.data.data.custom_remind == null){
                response.data.data.custom_remind = "填写真实身份信息，未满18岁、一证五号、信息错误将无法发货"
              }

              this.all = response.data.data;
              if (!this.all.origin_price) {
                this.all.origin_price = 0;
              }

              let obj = JSON.parse(this.all.json);
              this.all.yuezu = obj.yuezu;
              this.all.liuliang = obj.liuliang;
              this.all.taocan = obj.taocan;
              this.all.yuyin = obj.yuyin;

              if (!this.all.protocol_check) {
                this.all.protocol_check = 2;
              }

              if (this.all.protocol_id != "") {
                this.all.protocol_id = this.all.protocol_id.map(Number);
                console.log(this.all.protocol_id);
              }

              this.limit_type1 = this.all.limit_type;
              this.limit_type2 = this.all.limit_type;

              this.$set(this.all, "temp_id", 0);

              this.$set(this.all, "cat_ids", []);
              this.all.catgory.forEach(item2 => {
                this.all.cat_ids.push(item2.cat_id);
              });

              this.relo = false;
              this.$nextTick(() => {
                this.relo = true;
              });
              this.fuwenbenshow = true;

              // if(this.all.limit == 0){
              //   this.all.xiadanshuliang = false
              // }else{
              //   this.all.xiadanshuliang = true
              // }

              if (this.all.protocol_id != 0) {
                this.all.network_access_protocol = "1";
              }

              let wenjianjia = "web-page";
              if (process.env.NODE_ENV === "development") {
                // wenjianjia = 'test-web-page'
              }

              if (
                window.location.href.includes("storep.91haoka.cn") &&
                this.apis == ""
              ) {
                wenjianjia = "web-page";
              }
              if (
                window.location.href.includes("store.91haoka.cn") &&
                this.apis == ""
              ) {
                wenjianjia = "test-web-page";
              }
              if (window.location.href.includes("localhost")) {
                wenjianjia = "test-web-page";
              }

              axios
                .get(
                  `https://file.91haoka.cn/${wenjianjia}/${
                    this.$route.query.id
                  }.json?v=${Math.random()}`
                )
                // axios.get(`${this.apis}/storage/web-page/${this.$route.query.id}.json?v=${Math.random()}`)
                .then(response2 => {
                  this.all2 = JSON.parse(response2.data);

                  this.yansexuanzelog = true

                  if (!this.all2.yansename) {
                    this.all2.neirongcolor = "rgb(157, 111, 255)";
                    this.all2.anniucolor = "rgb(255, 64, 33)";
                    this.all2.anniuwenzi = "0元领取  包邮到家";
                    this.all2.yansename = "紫色";
                    this.all2.yueduyanse = "rgb(66, 6, 93)";
                  }

                  if (this.all2.jixiang != "2") {
                    this.$set(this.all2, "jixiang", "1");
                  } else {
                    this.$set(this.all2, "jixiang", "2");
                  }

                  if (this.all2.needidcard == undefined) {
                    this.$set(this.all2, "needidcard", "1");
                  }

                  if (!this.all2.lanjie) {
                    this.$set(this.all2, "lanjie", []);
                  }
                  if(this.all2.zimoren){
                    this.all2.zimoren = this.all2.zimoren
                  }else{
                    this.$set(this.all2, "zimoren", "1");
                  }
                  if(this.all2.sureagain){
                    this.all2.sureagain = this.all2.sureagain
                  }else{
                    this.$set(this.all2, "sureagain", "2");
                  }
                  this.relo = false
                  this.$nextTick(()=>{
                    this.relo = true
                  })
                  this.getchanpinxixi(response.data.data.page_id);
                  res("ok");
                });
            } else {
              this.$message.error(response.data.msg.info);
            }
          });
      });
      p.then(res => {
        if (this.all2.pinglunid) {
          let arr = [];
          for (let i in this.pinglunlist) {
            arr.push(this.pinglunlist[i].id);
          }
          if (!arr.includes(this.all2.pinglunid)) {
            this.all2.pinglunid = "";
          }
        }
      });
    } else {
      this.yansexuanzelog = true
      this.fuwenbenshow = true;
    }
  },
  beforeDestroy() {
    console.log("beforeDestroy");
    if (this.timer) {
      clearInterval(this.timer);
      this.timer = null;
    }
  },
  methods: {
    tianjiaitem:function(){
      this.all.custom_info.push({
        name:"",
        bitian:false,
        geshi:0
      })
      console.log(this.all.custom_info)
    },
    shanchuitem:function(index){
      this.all.custom_info.splice(index,1)
    },
    goRemark() {
      window.open("/web/zhiboxitong/pinglunguanli");
    },
    goAccord() {
      window.open("/web/zhiboxitong/ruwangxieyi");
    },
    addkeyword_notice: function() {
      this.all.keyword_notice.push({ keyword: "", notice: "" });
    },
    shanchukeyword_notice: function(index) {
      this.all.keyword_notice.splice(index, 1);
    },
    getsign: function() {
      axios.get(`${this.apis}/api/sms/message/sign`).then(response => {
        if (response.data.msg.code == 0) {
          this.signlist = response.data.data;
        } else {
          this.$message.error(response.data.msg.info);
        }
      });
    },
    shengchenglianjie: function() {
      // <el-option label="微信广点通" value="1"></el-option>
      // <el-option label="小红书" value="2"></el-option>
      // <el-option label="快手" value="3"></el-option>
      // <el-option label="B站" value="4"></el-option>
      // <el-option label="优酷" value="5"></el-option>
      // <el-option label="微博" value="6"></el-option>
      // <el-option label="百度" value="7"></el-option>

      if (this.all.huidiaoleixing == 1) {
        this.url =
          location.origin +
          "/h5/order_page.html?id=商品的id&projectid=__PROJECT_ID__&promotionid=__PROMOTION_ID__&creativetype=__CTYPE__&clickid=__CLICKID__&aid=__AID__&unionsite=__UNION_SITE__&advertiserid=__ADVERTISER_ID__&csite=__CSITE__&os=__OS__";
      }
      if (this.all.huidiaoleixing == 2) {
        this.url =
          location.origin + "/h5/order_page.html?id=商品的id";
      }
      if (this.all.huidiaoleixing == 3) {
        this.url =
          location.origin + "/h5/order_page.html?id=商品的id";
      }
      if (this.all.huidiaoleixing == 4) {
        this.url =
          location.origin + "/h5/order_page.html?id=商品的id";
      }
      if (this.all.huidiaoleixing == 5) {
        this.url =
          location.origin + "/h5/order_page.html?id=商品的id";
      }
      if (this.all.huidiaoleixing == 6) {
        this.url =
          location.origin +
          "/h5/order_page.html?id=商品的id&track_id=__TRACKID__";
      }
      if (this.all.huidiaoleixing == 7) {
        this.url =
          location.origin +
          "/h5/order_page.html?id=商品的id&youku_track_id=__TRACKID__&youku_creative_id=__CREATIVEID__";
      }
      if (this.all.huidiaoleixing == 8) {
        this.url =
          location.origin + "/h5/order_page.html?id=商品的id";
      }
      if (this.all.huidiaoleixing == 9) {
        this.url =
          location.origin + "/h5/order_page.html?id=商品的id";
      }
      if (this.all.huidiaoleixing == 10) {
        this.url =
          location.origin + "/h5/order_page.html?id=商品的id";
      }
      if (this.all.huidiaoleixing == 13) {
        this.url =
          location.origin + "/h5/order_page.html?id=商品的id&require_param=1";
      }
    },
    yinyong: function() {
      this.fuzhishangpinxinxilog = true;
      this.$nextTick(() => {
        this.$refs.fuzhishangpinxinxi.log = true;
      });
    },
    fuzhishangpinxinxi2: function(val) {
      this.fuzhishangpinxinxilog = false;
      //获取到id
      var all2 = "";
      let p = new Promise((res, rej) => {
        axios
          .get(`${this.apis}/api/page/info/manage?id=${val}`)
          .then(response => {
            if (response.data.msg.code == 0) {
              if (
                response.data.data.sell_point != null &&
                response.data.data.sell_point
              ) {
                let arr = ["", "", "", ""];
                if (JSON.parse(response.data.data.sell_point)[0]) {
                  arr[0] = JSON.parse(response.data.data.sell_point)[0];
                }
                if (JSON.parse(response.data.data.sell_point)[1]) {
                  arr[1] = JSON.parse(response.data.data.sell_point)[1];
                }
                if (JSON.parse(response.data.data.sell_point)[2]) {
                  arr[2] = JSON.parse(response.data.data.sell_point)[2];
                }
                if (JSON.parse(response.data.data.sell_point)[3]) {
                  arr[3] = JSON.parse(response.data.data.sell_point)[3];
                }
                response.data.data.sell_point2 = arr;
              } else {
                response.data.data.sell_point2 = ["", "", "", ""];
              }

              let all = response.data.data;

              if (!all.origin_price) {
                all.origin_price = 0;
              }

              let obj = JSON.parse(all.json);
              all.yuezu = obj.yuezu;
              all.liuliang = obj.liuliang;
              all.taocan = obj.taocan;
              all.yuyin = obj.yuyin;
              if (!all.protocol_check) {
                all.protocol_check = 2;
              }
              if (all.protocol_id != "") {
                all.protocol_id = all.protocol_id.map(Number);
                console.log(all.protocol_id);
              }

              this.limit_type1 = all.limit_type;
              this.limit_type2 = all.limit_type;

              this.$set(all, "temp_id", 0);

              // if(all.limit == 0){
              //   all.xiadanshuliang = false
              // }else{
              //   all.xiadanshuliang = true
              // }

              if (all.protocol_id != 0) {
                all.network_access_protocol = "1";
              }

              this.$set(all, "cat_ids", []);
              all.catgory.forEach(item2 => {
                all.cat_ids.push(item2.cat_id);
              });
              this.all.catgory = all.catgory;
              this.all.page_id = all.page_id;
              this.all.temp_id = all.temp_id;
              this.all.cat_id = all.cat_id;
              this.all.p_details = all.p_details;
              this.all.json = all.json;
              this.all.on_sale = all.on_sale;
              this.all.price = all.price;
              this.all.order = all.order;
              (this.all.delivery_area = all.delivery_area), //		是	string	无
                (this.all.delivery_city = all.delivery_city), //		是	string	无
                (this.all.page_name = all.page_name);
              this.all.page_source = all.page_source;
              this.all.limit = all.limit;
              this.all.limit_type = all.limit_type;
              this.all.network_access_protocol = all.network_access_protocol;
              this.all.protocol_id = all.protocol_id;
              this.all.protocol_check = all.protocol_check;
              this.all.order_button = all.order_button;
              this.all.tips = all.tips;
              this.all.sell_point = all.sell_point;
              this.all.sell_point2 = all.sell_point2;
              this.all.origin_price = all.origin_price;
              this.all.saled_amount = all.saled_amount;

              console.log(all);
              this.all.detail_pic_one = all.detail_pic_one;
              this.all.detail_pic_two = all.detail_pic_two;
              this.all.footer_description = all.footer_description;

              this.fuwenbenshow = false;
              this.relo = false;
              this.$nextTick(() => {
                this.fuwenbenshow = true;
                this.relo = true;
              });

              let wenjianjia = "web-page";
              if (process.env.NODE_ENV === "development") {
                // wenjianjia = 'test-web-page'
              }

              if (
                window.location.href.includes("storep.91haoka.cn") &&
                this.apis == ""
              ) {
                wenjianjia = "web-page";
              }
              if (
                window.location.href.includes("store.91haoka.cn") &&
                this.apis == ""
              ) {
                wenjianjia = "test-web-page";
              }
              if (window.location.href.includes("localhost")) {
                wenjianjia = "test-web-page";
              }

              axios
                .get(
                  `https://file.91haoka.cn/${wenjianjia}/${val}.json?v=${Math.random()}`
                )
                .then(response2 => {
                  all2 = JSON.parse(response2.data);
                  console.log(all2);
                  if (all2.needage == undefined) {
                    this.$message.error("引用商品信息不全，请手动更新部分信息");
                  }
                  if (!all2.yansename) {
                    all2.neirongcolor = "rgb(157, 111, 255)";
                    all2.anniucolor = "rgb(255, 64, 33)";
                    all2.anniuwenzi = "0元领取  包邮到家";
                    all2.yansename = "紫色";
                    all2.yueduyanse = "rgb(66, 6, 93)";
                  }
                  if (this.all2.jixiang != "2") {
                    this.$set(this.all2, "jixiang", "1");
                  } else {
                    this.$set(this.all2, "jixiang", "2");
                  }
                  if (all2.needidcard == undefined) {
                    this.$set(all2, "needidcard", "1");
                  }
                  this.getchanpinxixi(response.data.data.page_id);
                  res("ok");
                });
            } else {
              this.$message.error(response.data.msg.info);
            }
          });
      });
      p.then(res => {
        if (all2.pinglunid) {
          let arr = [];
          for (let i in this.pinglunlist) {
            arr.push(this.pinglunlist[i].id);
          }
          if (!arr.includes(all2.pinglunid)) {
            all2.pinglunid = "";
          }
        }

        this.all2.min_page = all2.min_page;
        this.all2.max_page = all2.max_page;
        this.all2.pinglunid = all2.pinglunid;

        this.all2.xiadanshuliang = all2.xiadanshuliang;
        this.all2.needage = all2.needage;
        this.all2.guozhengtong = all2.guozhengtong;
        this.all2.zuidaxiadan = all2.zuidaxiadan;
        this.all2.duanxin = all2.duanxin;
        this.all2.shouhuorenxingming = all2.shouhuorenxingming;
        this.all2.shenfenzheng = all2.shenfenzheng;
        this.all2.bufahuodiqu = all2.bufahuodiqu;
        this.all2.delivery_city = all2.delivery_city;
        this.all2.no_city = all2.no_city;
        this.all2.bufahuosheng = all2.bufahuosheng;
        this.all2.xiantianxie = all2.xiantianxie;
        this.all2.needidcard = all2.needidcard;
        this.all2.jixiang = all2.jixiang;
        this.all2.ruwangxieyi = all2.ruwangxieyi;
        this.all2.gongsiming = all2.gongsiming;
        this.all2.gongsidizhi = all2.gongsidizhi;
        this.all2.gongsidianhua = all2.gongsidianhua;
        this.all2.dingdanzhuangtai = all2.dingdanzhuangtai;
        this.all2.kuaishou = all2.kuaishou;
        this.all2.pinglun = all2.pinglun;
        this.all2.neirongcolor = all2.neirongcolor;
        this.all2.anniucolor = all2.anniucolor;
        this.all2.anniuwenzi = all2.anniuwenzi;
        this.all2.yansename = all2.yansename;
        this.all2.yueduyanse = all2.yueduyanse;
        this.all2.gm = all2.gm;
        this.all2.ddcx = all2.ddcx;
        this.all2.zxkf = all2.zxkf;
      this.all2.jumpUrl = all2.jumpUrl;
      this.all2.page_name_zi = all2.page_name_zi
          this.all2.page_id_zi = all2.page_id_zi
          if(all2.zimoren){
            this.all2.zimoren = all2.zimoren
          }else{
            this.$set(this.all2, "zimoren", "1");
          }
          if(all2.sureagain){
            this.all2.sureagain = all2.sureagain
          }else{
            this.$set(this.all2, "sureagain", "2");
          }
        console.log(this.all2);
      });
    },
    yanseshow: function() {
      this.$refs.yansexuanze.log = true;
    },
    yansexuanze: function(item) {
      let val = item.yanse
      this.all2.yuanjiao = item.yuanjiao

      if (val == 1) {
        this.all2.neirongcolor = "rgb(246, 194, 31)";
        this.all2.anniucolor = "rgb(168, 50, 252)";
        this.all2.yueduyanse = "rgb(99, 65, 0)";
        this.all2.yansename = "黄色";
      }
      if (val == 2) {
        this.all2.neirongcolor = "rgb(0, 190, 190)";
        this.all2.anniucolor = "rgb(255, 220, 54)";
        this.all2.yueduyanse = "rgb(0, 73, 89)";
        this.all2.yansename = "初音绿";
      }
      if (val == 3) {
        this.all2.neirongcolor = "rgb(0, 13, 190)";
        this.all2.anniucolor = "rgb(255, 67, 7)";
        this.all2.yueduyanse = "rgb(255, 173, 19)";
        this.all2.yansename = "蓝色";
      }
      if (val == 4) {
        this.all2.neirongcolor = "rgb(0, 190, 66)";
        this.all2.anniucolor = "rgb(255, 212, 7)";
        this.all2.yueduyanse = "rgb(0, 106, 4)";
        this.all2.yansename = "绿色";
      }
      if (val == 5) {
        this.all2.neirongcolor = "rgb(255, 63, 123)";
        this.all2.anniucolor = "rgb(255, 212, 7)";
        this.all2.yueduyanse = "rgb(80, 5, 52)";
        this.all2.yansename = "粉红色";
      }
      if (val == 6) {
        this.all2.neirongcolor = "rgb(255, 63, 63)";
        this.all2.anniucolor = "rgb(255, 212, 7)";
        this.all2.yueduyanse = "rgb(71, 13, 13)";
        this.all2.yansename = "红色";
      }
      if (val == 7) {
        this.all2.neirongcolor = "rgb(63, 116, 255)";
        this.all2.anniucolor = "rgb(255, 193, 0)";
        this.all2.yueduyanse = "rgb(21, 22, 124)";
        this.all2.yansename = "浅蓝色";
      }
      if (val == 8) {
        this.all2.neirongcolor = "rgb(157, 111, 255)";
        this.all2.anniucolor = "rgb(255, 64, 33)";
        this.all2.yueduyanse = "rgb(66, 6, 93)";
        this.all2.yansename = "紫色";
      }
      if (val == 9) {
        this.all2.neirongcolor = "rgb(255, 255, 255)";
        this.all2.anniucolor = "rgb(255, 60, 60)";
        this.all2.yueduyanse = "rgb(0, 126, 255)";
        this.all2.yansename = "白色";
      }
      if (val == 10) {
        this.all2.neirongcolor = "rgb(0, 0, 0)";
        this.all2.anniucolor = "#FFBC41";
        this.all2.yueduyanse = "#FDC96A";
        this.all2.yansename = "黑色";
      }
    },
    xuanzeshuliang2: function() {
      if (!this.all2.xiadanshuliang) {
        this.all.limit = 0;
      }
    },
    xuanzeshuliang: function() {
      // if(this.all.limit == 0){
      //   this.all.xiadanshuliang = false
      // }else{
      //   this.all.xiadanshuliang = true
      // }
    },
    shifouxianshixieyi2: function() {
      if (this.all.network_access_protocol == 0) {
        this.all.protocol_id = [];
      }
    },
    shifouxianshixieyi: function() {
      if (this.all.protocol_id != 0) {
        this.all.network_access_protocol = "1";
      }
    },
    xuanzeshangpinkai: function(type) {
      this.iszi = type
      this.fuzhixinxi = false;
      this.log_shop = true;
    },
    xuanzeshangpinkai2: function() {
      this.fuzhixinxi = true;
      this.log_shop = true;
    },

    getchanpinxixi: function(page_id) {
      axios
        .get(`${this.apis}/api/product/info?page_id=${page_id}`)
        .then(response => {
          if (response.data.msg.code == 0) {
            this.chanpinxixi = response.data.data;
            this.chooseitem.take_number = response.data.data.take_number;
            // alert(this.chooseitem.take_number)
            if (this.chanpinxixi.real_name_type == 0) {
              this.xiaozi = true;
            } else {
              this.xiaozi = false;
            }
          } else {
            this.$message.error(response.data.msg.info);
          }
        });
    },
    fuwenbenfanhui: function(html) {
      this.all.description = html;
    },
    fuwenbenfanhui2: function(html) {
      this.all.footer_description = html;
    },

    getshangpinfenlei: function() {
      axios.get(`${this.apis}/api/catgory/list`).then(response => {
        if (response.data.msg.code == 0) {
          this.shangpinfenlei = response.data.data;
        } else {
          this.$message.error(response.data.msg.info);
        }
      });

      this.timer = setInterval(() => {
        axios
          .get(`${this.apis}/api/network-process-protocol/list`)
          .then(response => {
            if (response.data.msg.code == 0) {
              this.xieyilist = response.data.data;
            } else {
              this.$message.error(response.data.msg.info);
            }
          });
        axios.get(`${this.apis}/api/comment/template/list`).then(response => {
          if (response.data.msg.code == 0) {
            this.pinglunlist = response.data.data;
          } else {
            this.$message.error(response.data.msg.info);
          }
        });
      }, 5000);
    },
    upup: function(file) {
      var params = new FormData();
      params.append("file", file.file);
      params.append('noDelivery',1);
      axios.post(`${this.apis}/api/delivery/data`, params).then(response => {
        if (response.data.msg.code == 0) {
          this.all2.bufahuodiqu = "3";
          this.all2.no_city = response.data.data;
        } else {
          this.$message.error(response.data.msg.info);
        }
      });
    },
    down: function() {
      const a = document.createElement("a");
      a.setAttribute("download", "不发货省市区.xlsx");
      a.setAttribute("href", "/web/static/bufahuoshengshiqu.xlsx");
      a.click();
    },
    test: function() {
      this.all2.bufahuosheng = [];
      let checkedNodeList = this.$refs.test.getCheckedNodes();
      console.log(checkedNodeList);
      checkedNodeList = checkedNodeList.filter(
        item => item.parent == null && item.checked
      ); // 核心
      checkedNodeList.forEach(item => {
        this.all2.bufahuosheng.push(item.value);
      });
    },
    xuanzhong2: function(item) {},

    xuanzhong: function(item) {
      console.log(item);
      if(this.iszi==1){
        this.chooseitem = item;
        //查看产品信息
        if (item.max_age || item.min_age) {
          this.all2.needage = true;
          this.all2.min_page = item.min_age;
          this.all2.max_page = item.max_age;
        }
        if (item.max_purchase > 0) {
          this.all2.xiadanshuliang = true;
          this.all.limit = item.max_purchase;
        }
        if (item.real_name_type == 0) {
          this.all2.shenfenzheng = true;
          this.xiaozi = true;
        } else {
          this.all2.shenfenzheng = false;
          this.xiaozi = false;
        }

        if (item.is_need_custom_photo == 1) {
          this.all2.shangchuanneirongma = true
        } else {
          this.all2.shangchuanneirongma = false
        }

        this.all.page_id = item.id;
        this.all.page_name = item.title;
        this.all.pic = item.image1;

        this.relo = false;
        this.$nextTick(() => {
          this.relo = true;
        });

        this.all.description = item.description;
        this.fuwenbenshow = false;
        this.$nextTick(() => {
          this.fuwenbenshow = true;
        });
        this.log_shop = false;
      }else{
          //是子商品
          this.all2.page_id_zi = item.id
          this.all2.page_name_zi = item.title
          this.log_shop = false
        }

    },
    fabu: function() {
      if (!this.all.page_id || !this.all.sale_name || !this.all.price) {
        this.$message.error("请填写必选选项");
        return false;
      }
      let obj = {
        yuezu: this.all.yuezu,
        liuliang: this.all.liuliang,
        taocan: this.all.taocan,
        yuyin: this.all.yuyin
      };
      this.all.json = JSON.stringify(obj);

      if (this.all2.needidcard == "2") {
        this.all.limit_type = this.limit_type2;
      } else {
        this.all.limit_type = this.limit_type1;
      }

      this.all.sell_point = JSON.stringify(this.all.sell_point2);

      if (this.all.order_button == "") {
        this.all.order_button = "立即办理";
      }
      this.all.deliver_type = this.all2.bufahuodiqu;

      if (this.chooseitem.take_number > 0) {
        //支持选号
        this.all.is_pick_num = this.is_pick_num;
      }



      axios.post(`${this.apis}/api/page/make`, this.all).then(response => {
        if (response.data.msg.code == 0) {
          var that = this;
          let id = this.$route.query.id
            ? this.$route.query.id
            : response.data.data.id;
          var Obj2str = function(o) {
            if (o == undefined) {
              return "";
            }
            var r = [];
            if (typeof o == "string")
              return (
                '"' +
                o
                  .replace(/([\"\\])/g, "\\$1")
                  .replace(/(\n)/g, "\\n")
                  .replace(/(\r)/g, "\\r")
                  .replace(/(\t)/g, "\\t") +
                '"'
              );
            if (typeof o == "object") {
              if (!o.sort) {
                for (var i in o) r.push('"' + i + '":' + Obj2str(o[i]));
                if (
                  !!document.all &&
                  !/^\n?function\s*toString\(\)\s*\{\n?\s*\[native code\]\n?\s*\}\n?\s*$/.test(
                    o.toString
                  )
                ) {
                  r.push("toString:" + o.toString.toString());
                }
                r = "{" + r.join() + "}";
              } else {
                for (var i = 0; i < o.length; i++) r.push(Obj2str(o[i]));
                r = "[" + r.join() + "]";
              }
              return r;
            }
            return o.toString().replace(/\"\:/g, '":""');
          };

          let wenjianjia = "web-page";
          if (process.env.NODE_ENV === "development") {
            // wenjianjia = 'test-web-page'
          }
          if (
            window.location.href.includes("storep.91haoka.cn") &&
            this.apis == ""
          ) {
            wenjianjia = "web-page";
          }
          if (
            window.location.href.includes("store.91haoka.cn") &&
            this.apis == ""
          ) {
            wenjianjia = "test-web-page";
          }
          if (window.location.href.includes("localhost")) {
            wenjianjia = "test-web-page";
          }

          axios
            .post(`${this.apis}/api/qiniu/token`, {
              bucket: "gthshopstore",
              cloud: `${wenjianjia}/${id}.json`
            })
            .then(response => {
              if (response.data.msg.code == 0) {
                const observer = {
                  next(res) {},
                  error(err) {},
                  complete(res) {
                    that.$message.success("发布成功");

                    if (that.$route.query.app_id) {
                      that.$router.push({
                        path: "/zhiboxitong/xiaochengxu/xiaochengxu_shangpin",
                        query: {
                          id: that.$route.query.tab,
                          app_id: that.$route.query.app_id,
                          xcxtype: that.$route.query.xcxtype
                        }
                      });
                    } else {
                      if (that.all.tab) {
                        that.goid(
                          "/zhiboxitong/zhiboxiaoshou/zhiboxiaoshou_shangpin",
                          that.$route.query.tab
                        );
                      } else {
                        that.goid(
                          "/zhiboxitong/meitituiguang/meitituiguang_fabu2",
                          id
                        );
                      }
                    }
                  }
                };

                let files = Obj2str(JSON.stringify(this.all2));
                let file = new File([files], `${wenjianjia}/${id}.json`, {
                  type: "application/json"
                });
                const observable = qiniu.upload(
                  file,
                  file.name,
                  response.data.data,
                  {},
                  {}
                );
                const subscription = observable.subscribe(observer); // 上传开始
              } else {
                this.$message.error(response.data.msg.info);
              }
            });

          // let id = this.$route.query.id ? this.$route.query.id : response.data.data.id

          //  let data = {
          //    id:id,//	是	string	销售页的id
          //    type:"json",//	是	string	css json 等 文件的后缀本示例为 5.css
          //    data:JSON.stringify(this.all2),//	是	array	要存的数据 到时候访问id.type(5.css)返回的就是data里的数据
          //    path:"page",//	否	string	store 店铺用的 page 商品用的
          //  }
          //  axios.post(`${this.apis}/api/page/json`,data)
          //       		.then(response => {
          //       			if (response.data.msg.code == 0) {
          //               this.$router.push({
          //                 path:'/zhiboxitong/meitituiguang/meitituiguang_fabu2',
          //                 query:{
          //                   id:id
          //                 }
          //               })
          //       			} else {
          //       				this.$message.error(response.data.msg.info);
          //       			}
          //       	})
        } else {
          this.$message.error(response.data.msg.info);
        }
      });
    },
    getimg: function(img) {
      this.all.pic = img;
    },
    getimg2: function(img) {
      this.all.details = img;
    },
    getimg3: function(img) {
      this.all.market_pic = img;
    },
    getimg4: function(img) {
      this.all.detail_pic_one = img;
    },
    getimg5: function(img) {
      this.all.detail_pic_two = img;
    },
    getimg6:function(img){
        this.all2.pic_zi = img
      },
    getimg8:function(img){
      this.all2.pic_sure = img
    },
    getimg9:function(img){
      this.all2.custom_photo_illustration = img
    },
    getimgk: function(img) {
      this.all.pop_banner = img;
    },

    xiayibu: function() {
      this.goid("/zhiboxitong/zhiboxiaoshou_fabu2");
    },
    //获取商品
    getshops: function() {
      axios
        .get(`${this.apis}/api/order-page/list`, {
          params: this.shopsearch
        })
        .then(response => {
          if (response.data.msg.code == 0) {
            this.shoplists = response.data.data;
          } else {
            this.$message.error(response.data.msg.info);
          }
        });
    },
    //当前是否需要身份证
    isneedcard(e) {
      console.log(e);
      //选择了不需要身份证
      if (e == 2) {
        //国政通取消
        this.all2.guozhengtong = false;
        //收货人使用身份证姓名取消
        this.all2.shouhuorenxingming = false;
        this.all2.needage = false;
        this.all2.min_page = "";
        this.all2.max_page = "";
      }
    },

  }
};
</script>

<style scoped lang="less">
.alt_image {
  cursor: pointer;
  margin-right: 50px;
  width: 280px;
  height: 130px;
  position: fixed;
  margin-top:16px ;
  top: 0;

}
.meitituiguang_fabu {
  // background: #f2f2f2; color: #333;
  min-height: 100vh;
  /deep/ .el-select {
    .el-select__caret:before {
      content: "\e790";
    }
  }
  /deep/ .el-select .el-input .el-select__caret {
    transform: rotateZ(0deg);
  }
  /deep/ .el-input__inner {
    border-color: rgb(191, 191, 191);
  }
  /deep/ .el-input__inner {
    // border: none;
    // background:rgba(0, 0, 0,0.1);
    height: 40px;
    border-radius: 12px;
  }
  /deep/ .el-dialog {
    border-radius: 20px;
  }
  /deep/ .el-dialog__title {
    font-size: 20px;
    font-weight: bold; /* 修改标题字体大小 */
  }
  /deep/ .el-switch .el-switch__core {
    height: 18px !important;
    width: 36px !important;
    border-color: rgb(69, 69, 69) !important;
    background-color: rgb(255, 255, 255) !important;
    &::after {
      background-color: rgb(69, 69, 69);
      width: 14px;
      height: 14px;
    }
  }
  /deep/ .is-checked .el-switch__core {
    border-color: rgb(71, 140, 253) !important;
    height: 18px !important;
    width: 36px !important;
    background-color: rgb(71, 140, 253) !important;
    &::after {
      background-color: rgb(255, 255, 255);
      width: 14px;
      height: 14px;
    }
  }
  /deep/ .w-e-toolbar {
    z-index: 11 !important;
  }
  /deep/ .w-e-text-container {
    z-index: 10 !important;
  }
  /deep/ .el-breadcrumb {
    font-size: 16px;
  }
  ::-webkit-scrollbar {
    /*滚动条整体样式*/
    width: 1px; /*高宽分别对应横竖滚动条的尺寸*/
    height: 1px;
  }
  ::-webkit-scrollbar-thumb {
    /*滚动条里面小方块*/
    border-radius: 10px;
    box-shadow: inset 0 0 5px rgba(97, 184, 179, 0.1);
    background: #eee;
  }
  ::-webkit-scrollbar-track {
    /*滚动条里面轨道*/
    box-shadow: inset 0 0 5px rgba(87, 175, 187, 0.1);
    border-radius: 10px;
    background: #fff;
  }
  * {
    box-sizing: border-box;
  }
  .zhiboxitong_content {
    height: calc(100vh - 70px);
    position: fixed;
    .left {
      width: 210px;
      background: #fafafe;
      height: 100%;
    }
    .right {
      width: calc(100vw - 217px);
      overflow: auto;
      height: 100vh;
      .zhiboxitong_right {
        height: calc(100vh - 90px);
        background: #fff;
        border-radius: 5px;
        padding: 20px 0 0 20px;
      }
      .xiaright {
        width: 300px;
        height: 700px;
        background: url("https://static.91haoka.cn/gantanhao/shouji3.png");
        background-size: 300px 700px;
        padding: 50px 20px;
        img {
          width: 100%;
        }
      }
      .fleft {
        padding-top: 50px;
        .ft {
          font-size: 18px;
          margin-bottom: 30px;
          font-weight: bold;
        }
        .z {
          width: 125px;
          text-align: right;
          padding-right: 20px;
          font-size: 14px;
        }
        .r {
        }
      }
      .buzhou {
        padding: 50px;
      }
    }
  }

  .flex {
    display: flex;
    flex-wrap: wrap;
  }

  .flexb {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .flexc {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }

  .flexbc {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
  }

  .flexcc {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
  }
}
.quote_images{
  display: flex;
  justify-content: flex-end;


}
</style>
